<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:s="http://jboss.com/products/seam/taglib"
      xmlns:rich="http://richfaces.org/rich"
      xmlns:a="http://richfaces.org/a4j"
      template="/layout/template.xhtml">
    
    <ui:define name="head">
		<link href="stylesheet/tickets.css" rel="stylesheet" type="text/css"/>
		<script type="text/javascript" language="javascript">
			function openDialog() {
				$(".form").dialog();
			}
		</script>
	</ui:define>
    
    <ui:define name="title">Tickets</ui:define>
		
	<ui:define name="content">
		<script>
			$(function() {
				$( ".deadline_picker" ).datepicker();
			});

			$(document).ready(function() {
				$(".form").hide();
				if (window.location.href.search("ticketId") != -1) {
					openDialog();
				}
			});
		</script>
		<a href="#" onclick="openDialog()">New ticket</a>
		<hr />
	
		<div class="results">

			<a:repeat value="#{milestoneController.milestoneList()}"
					  rendered="#{not empty milestoneController.milestoneList()}"
					  var="milestone">
					  
				<h:outputText value="Milestone: " styleClass="milestoneLabelStyle"/>
				<div class="titleLink"><s:link id="milestoneLink" value="#{milestone.name}" propagation="none" view="/milestones.xhtml">
                      <f:param name="milestoneId" value="#{milestone.id}"/>
               	</s:link></div>
				<div class="ticketListStyle">
					<a:repeat value="#{ticketsController.ticketListByMilestone(milestone)}"
							  rendered="#{not empty ticketsController.ticketListByMilestone(milestone)}"
							  var="tick">
						<div class="ticketDescription">
							<s:link id="ticketName" value="#{tick.name}" propagation="none" view="/tickets.xhtml" styleClass="ticketNameStyle">
                      			<f:param name="ticketId" value="#{tick.id}"/>
               				</s:link><br/>
							<h:outputText styleClass="ticketData" value="Deadline:" /> <h:outputText value="#{tick.deadline}" /><br/>
							<h:outputText styleClass="ticketData" value="Description:" /> <h:outputText value="#{tick.description}" /><br/>
							<h:outputText styleClass="ticketData" value="Priority:" /> <h:outputText value="#{tick.priority.label}" /><br/>
							<h:outputText styleClass="ticketData" value="Type:" /> <h:outputText value="#{tick.type.label}" /><br/>
							<h:outputText styleClass="ticketData" value="State:" /> <h:outputText value="#{tick.state.label}" /><br/>
						</div>
					</a:repeat>
				</div>
				<hr/>
				
			</a:repeat>

        </div>
        
        <div class="form">
	        <h:form id="ticketForm">
	        	<h4>Add, modify or delete a ticket:</h4>
	        	<h:outputText value="Name:" /><br/>
	        	<h:inputText id="name" required="true" value="#{ticketHome.instance.name}"/><br/>
	        	<h:outputText value="Deadline:" /><br/>
	        	<h:inputText type="text" value="#{ticketHome.instance.deadline}" styleClass="deadline_picker"/><br />
			    <h:outputText value="Description: "/><br/>
			    <h:inputTextarea cols="30" rows="5" value="#{ticketHome.instance.description}" /><br/>
			    <h:outputText value="Type: "/><br/>
			    <h:selectOneMenu value="#{ticketHome.instance.type}">
					<s:selectItems var="ty" value="#{ticketTypeFactory.ticketTypes}" label="#{ty.label}"/>
					<s:convertEnum/>
				</h:selectOneMenu><br/>
				<h:outputText value="Priority: "/><br/>
			    <h:selectOneMenu value="#{ticketHome.instance.priority}">
					<s:selectItems var="pri" value="#{priorityFactory.priorities}" label="#{pri.label}"/>
					<s:convertEnum/>
				</h:selectOneMenu><br/>
				<h:outputText value="State: "/><br/>
				<h:selectOneMenu value="#{ticketHome.instance.state}">
					<s:selectItems var="sta" value="#{ticketStateFactory.states}" label="#{sta.label}"/>
					<s:convertEnum/>
				</h:selectOneMenu>
				<h:outputText value="Milestone: "/><br/>
				<h:selectOneMenu value="#{ticketHome.instance.milestone}">
					<s:selectItems var="milf" value="#{milestoneController.milestoneList()}" label="#{milf.name}"/>
					<s:convertEntity/>
				</h:selectOneMenu>
		        <div class="commandButtons">
		            <h:commandButton id="save"
		                          value="Save"
		                         action="#{ticketsController.persist()}"
		                       rendered="#{!ticketHome.managed}"/>
		            <h:commandButton id="update"
		                          value="Save"
		                         action="#{ticketsController.update()}"
		                       rendered="#{ticketHome.managed}"/>
		            <h:commandButton id="delete"
		                          value="Delete"
		                         action="#{ticketsController.remove()}"
		                      immediate="true"
		                       rendered="#{ticketHome.managed}"/>
		            <s:button propagation="end"
		                               id="cancel"
		                            value="Cancel"
		                             view="/tickets.xhtml"/>
		        </div>
	    	</h:form>
    	</div>
	</ui:define>

</ui:composition>